====== Play music along several pages ======

SoSci gives you the opportunity to present music or videos along the whole qustionaire by means of a frameset. How this works is shown below.((Thanks to [[sbrand@students.uni-mainz.de|Sebastian Brand]] for this chapter.)).


===== Define a frameset =====

The first step is to create a frameset in SoSci Survey. Click [[http://wiki.selfhtml.org/wiki/HTML/Frames|SelfHTML: Frames]] to see what a frameset is. Loosley speaking a frameset is a table, which devides a website into areas, whereas the contents can be worked on individually. 

To generate a frameset in SoSci Survey a text file has to be created on the desktop. Name it e.g. “Start.html”.

**Important:** It is crucial saving the file as a pure ASCII-text. Due to this it is necessary to use a text editor (e.g. [[https://notepad-plus-plus.org/|Notepad++]], [[http://www.scintilla.org/SciTE.html|SciTE]] or Windows note pad) but __no__ word processor such as MS Word or OpenOffice/LibreOffice.

**Important:** Take care that the file extension is changed respectively, converting the former text file into an html-file. The file should now contain the following html-code:

<code html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>Questionnaire</title>
  </head>
  <frameset rows="99%, 1%">
    <frame src="https://www.soscisurvey.de/PROJECT/" name="survey">
    <frame name="Exampleframe">
  </frameset>
</html>
</code>

Watch out for the line ''<frame src=...'' -- your individual questionnaire-URL should be taken down here ([[:en:survey:url]]) in order to start the questionnaire in the frame. According to personal needs and preferences the following changes in the code can be made additionally:

  * The attribute ''rows'' can be replaced by ''cols'' to change intersecting the page by line (frames below each other) to intersecting by row (next to each other).
  * Division by percentage can be adapted.
  * Frames can be renamed (attribute ''name'').
  * Frames ca be added as long as a total of 100 is summed up in the line and row percentages.
  * Using the command  ''%%border="0"%%''  borders around the frames can be deleted.

After creating and working on the file it can be loaded up in **pics and media** to the project directory. The result will be visible by attaching ''/start.html'' e.g. ''%%https://www.soscisurvey.de/PROJECT/start.html%%'' to the project’s URL.

**Important**: Do __not__ upload the protected filestorage!


===== Prepare Frame content =====

The next step ist o decide what kind of content shall be uploaded to a frame. The frame should fit for a video in order to see it completely. In case of music it should be rather small so it doesn’t hide the questionnaire itself. If you know what contents ist to be added to the frame th following steps have to be taken; Create a new txt i.e. HTML file on the desktop e.g. ''play.html''. Edit file and add the HTML code which will play the contents. Here an example for music:

<code html>
<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8">
    <title>Audio</title>
  </head>
  <body>
    <audio id="bgAudio01" preload autoplay>
      <source src="EXAMPLE.MP3">
    </audio>
  </body>
</html>
</code>

Here the audio file was attached by ''<audio>''-tag, which is supported by most browsers. Attaching by flash player is explained here: [[:en:create:media]]

The music file („EXAMPLE.MP3“) has to be uploaded to SoSci Survey likewise. Setting the player’s pixel size to zero lets the player disappear leaving the music playing (e.g. 110 pixel). Now the edited file has to be loaded up to the project’s directory as well.


===== Load frame contents =====

Probably the audio file is not meant to play from the beginning but rather start at some point later on. For this purpose copy the file ''play.html'' via JavaScript to the little frame. This is achieved by creating a new text fragment in **Text Elements & Labels** containing the following:

<code html>
<script type="text/javascript">
<!--
top.Exampleframe.location.href = "play.html";
// -->
</script>
</code>

If this text fragment is now added to a page in the questionaire the content of the frame is changed automatically and music, video etc will be uploaded.


===== Delete frame contents =====

To empty frames (and to silence the music) load an empty HTML page into the frame. Most suitable an empty html document is created on the desktop which can be named ''empty.html''. As the name states leave it empty an upload respectively. The music can be stopped using the following command: 

<code html>
<script type="text/javascript">
<!--
top.Exampleframe.location.href = "empty.html";
// -->
</script>
</code>


===== Limitations =====

  * While loading the frame set it is not possible to transmit variables (e.g. reference or serial number) to the questionaire, as mentioned here: [[:en:survey:url]].
  * Using this solution fading the music is not feasible. It is cut out abruptly loading the empty file.